﻿<Controls:MetroWindow x:Class="MetroDemo.ExampleWindows.FlyoutDemo"
                      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                      xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
                      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                      xmlns:metroDemo="clr-namespace:MetroDemo"
                      xmlns:exampleWindows="clr-namespace:MetroDemo.ExampleWindows"
                      Title="Flyouts Demo"
                      Width="800"
                      Height="600"
                      SaveWindowPosition="True"
                      WindowStartupLocation="CenterScreen"
                      BorderThickness="1"
                      BorderBrush="{DynamicResource AccentColorBrush}"
                      mc:Ignorable="d"
                      d:DataContext="{d:DesignInstance metroDemo:MainWindowViewModel}"
                      x:Name="flyoutsDemo">

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/FlatButton.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro.Resources;component/Icons.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>

    <Controls:MetroWindow.IconTemplate>
        <DataTemplate>
            <Grid Width="{TemplateBinding Width}"
                  Height="{TemplateBinding Height}"
                  Margin="4"
                  Background="{DynamicResource IdealForegroundColorBrush}"
                  RenderOptions.EdgeMode="Aliased"
                  RenderOptions.BitmapScalingMode="HighQuality">
                <Grid.OpacityMask>
                    <VisualBrush Stretch="Uniform"
                                 Visual="{DynamicResource appbar_box}" />
                </Grid.OpacityMask>
            </Grid>
        </DataTemplate>
    </Controls:MetroWindow.IconTemplate>

    <Controls:MetroWindow.TitleTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content, Converter={StaticResource ToUpperConverter}}"
                       TextTrimming="CharacterEllipsis"
                       HorizontalAlignment="Right"
                       VerticalAlignment="Center"
                       Margin="0 -1 8 0"
                       FontSize="{DynamicResource WindowTitleFontSize}"
                       FontFamily="{DynamicResource HeaderFontFamily}" />
        </DataTemplate>
    </Controls:MetroWindow.TitleTemplate>

    <Controls:MetroWindow.LeftWindowCommands>
        <Controls:WindowCommands>
            <Button FontFamily="Wingdings"
                    FontSize="20"
                    Content="A" />
        </Controls:WindowCommands>
    </Controls:MetroWindow.LeftWindowCommands>

    <Controls:MetroWindow.RightWindowCommands>
        <Controls:WindowCommands>
            <Button FontFamily="Wingdings"
                    FontSize="20"
                    Content="B" />
            <Button FontFamily="Wingdings"
                    FontSize="20"
                    Content="C" />
        </Controls:WindowCommands>
    </Controls:MetroWindow.RightWindowCommands>

    <Controls:MetroWindow.Flyouts>
        <Controls:FlyoutsControl>
            <Controls:Flyout x:Name="settingsFlyout"
                             Margin="100 0 0 0"
                             Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Controls:MetroWindow}, Path=ActualWidth}"
                             Header="Settings"
                             Position="Right">
                <Grid Margin="10">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0"
                               Text="Something above the ScrollPanel" />

                    <ScrollViewer Grid.Row="1"
                                  VerticalScrollBarVisibility="Auto">
                        <StackPanel Orientation="Vertical">
                            <TextBox x:Name="firstTB" Controls:TextboxHelper.Watermark="TextBox 01" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 02" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 03" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 04" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 05" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 06" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 07" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 08" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 09" />
                            <TextBox Margin="0,5,0,0"
                                     Controls:TextboxHelper.Watermark="TextBox 10" />
                        </StackPanel>
                    </ScrollViewer>
                    <UniformGrid Columns="2"
                                 Grid.Row="2"
                                 Margin="10">
                        <Button Style="{DynamicResource SquareButtonStyle}"
                                Margin="10"
                                Content="Create" />
                        <Button Style="{DynamicResource SquareButtonStyle}"
                                Margin="10"
                                Content="Cancel" />
                    </UniformGrid>
                </Grid>
            </Controls:Flyout>

            <Controls:Flyout Header="New Goodness"
                             Position="Right"
                             Width="{Binding ElementName=settingsFlyout, Path=ActualWidth, Mode=OneWay}">
                <StackPanel Orientation="Vertical"
                            Margin="10">
                    <Button Content="create" />
                    <Button Content="cancel" />
                </StackPanel>
            </Controls:Flyout>
            <exampleWindows:CustomFlyout />

            <Controls:Flyout Header="Accented"
                             Position="Right"
                             Theme="Accent">
                <Grid Margin="10"
                      Width="400">
                    <StackPanel>
                        <TextBlock Text="This flyout adapts its theme to the current accent"
                               Foreground="{DynamicResource IdealForegroundColorBrush}" />
                        <GroupBox Margin="10" Height="250" Header="Flyout Group Box" />
                    </StackPanel>
                </Grid>
            </Controls:Flyout>
            <Controls:Flyout Header="Inverse"
                             Position="Right"
                             Theme="Inverse">
                <Grid Margin="10"
                      Width="400">
                    <TextBlock Text="This flyout has the inverse theme of the current window theme" />
                </Grid>
            </Controls:Flyout>
            <Controls:Flyout Header="Adapt"
                             Position="Right"
                             Theme="Adapt">
                <Grid Margin="10"
                      Width="400">
                    <TextBlock Text="This flyout adapts the theme of the current window" />
                </Grid>
            </Controls:Flyout>
            <Controls:Flyout Header="Cool"
                             AnimateOnPositionChange="{Binding AnimateOnPositionChange}"
                             Position="Right">
                <Grid Margin="10"
                      Width="270">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto"></RowDefinition>
                    </Grid.RowDefinitions>
                    <Label Grid.Row="0"
                           Grid.Column="0"
                           Margin="5"
                           VerticalAlignment="Center"
                           Content="Download language:" />
                    <ComboBox x:Name="flyoutSettingsComboboxDownloadlanguage"
                              Grid.Row="0"
                              Grid.Column="1"
                              Margin="0,5,5,5"
                              VerticalAlignment="Center" />
                    <Button x:Name="flyoutSettingsButtonSave"
                            Grid.Row="1"
                            Grid.Column="1"
                            Width="75"
                            Margin="5"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Bottom"
                            Content="Save" />
                    <UniformGrid Columns="3"
                                 Grid.Column="0"
                                 Grid.ColumnSpan="2"
                                 Grid.Row="2"
                                 Margin="10">
                        <CheckBox IsChecked="{Binding AnimateOnPositionChange}">Animate</CheckBox>
                        <Button Style="{DynamicResource SquareButtonStyle}"
                                Margin="10"
                                Click="ShowSettingsLeft"
                                Content="Left" />
                        <Button Style="{DynamicResource SquareButtonStyle}"
                                Margin="10"
                                Click="ShowSettingsRight"
                                Content="Right" />
                    </UniformGrid>
                </Grid>
            </Controls:Flyout>
            <Controls:Flyout Header="Left"
                             Position="Left">
                <StackPanel Width="150"
                            Margin="5,5,5,5">
                    <TextBlock Text="a test for left" />
                    <CheckBox Content="a simple checkbox" />
                    <RadioButton Content="a simple RadioButton" />
                    <ComboBox>
                        <ComboBoxItem>Item 1</ComboBoxItem>
                        <ComboBoxItem>Item 2</ComboBoxItem>
                        <ComboBoxItem>Item 3</ComboBoxItem>
                    </ComboBox>
                </StackPanel>
            </Controls:Flyout>
            <Controls:Flyout Header="Top"
                             Position="Top">
                <StackPanel Height="100"
                            Margin="5,5,5,5"
                            HorizontalAlignment="Right"
                            Orientation="Horizontal">
                    <Button Width="40"
                            Height="40"
                            FontFamily="Segoe UI Symbol"
                            FontSize="16"
                            Style="{DynamicResource MetroCircleButtonStyle}">
                        <Rectangle Width="20"
                                   Height="20">
                            <Rectangle.Fill>
                                <VisualBrush Stretch="Fill"
                                             Visual="{StaticResource appbar_add}" />
                            </Rectangle.Fill>
                        </Rectangle>
                    </Button>
                </StackPanel>
            </Controls:Flyout>
            <Controls:Flyout Header="Bottom"
                             Position="Bottom">
                <StackPanel Height="80"
                            Margin="5,5,5,5"
                            HorizontalAlignment="Right"
                            Orientation="Horizontal">
                    <Button Width="40"
                            Height="40"
                            FontFamily="Segoe UI Symbol"
                            FontSize="16"
                            Style="{DynamicResource MetroCircleButtonStyle}">
                        <Rectangle Width="20"
                                   Height="20">
                            <Rectangle.Fill>
                                <VisualBrush Stretch="Fill"
                                             Visual="{StaticResource appbar_add}" />
                            </Rectangle.Fill>
                        </Rectangle>
                    </Button>
                </StackPanel>
            </Controls:Flyout>
            <Controls:Flyout Header="Modal"
                             Position="Right"
                             IsModal="True">
                <StackPanel Height="80"
                            Margin="5,5,5,5"
                            Orientation="Horizontal">
                    <TextBlock>Modal Flyout</TextBlock>
                </StackPanel>
            </Controls:Flyout>
        </Controls:FlyoutsControl>
    </Controls:MetroWindow.Flyouts>
    <Grid>
        <StackPanel Margin="10"
                    HorizontalAlignment="Left">
            <CheckBox Content="ShowWindowCommandsOnTop"
                      IsChecked="{Binding ElementName=flyoutsDemo, Path=ShowWindowCommandsOnTop}" />
            <TextBlock Margin="10"
                       FontSize="30"
                       Text="Some Flyout Tests..." />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowFirst"
                    Content="Show 1" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowSecond"
                    Content="Show 2" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowThird"
                    Content="Show 3" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowAccent"
                    Content="Accent" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowInverse"
                    Content="Inverse" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowAdapt"
                    Content="Adapt" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowSettings"
                    Content="Settings" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowModal"
                    Content="Modal" />
            <Button MinWidth="90"
                    Margin="2"
                    Click="CloseMe"
                    Content="Close" />
        </StackPanel>
        <AdornerDecorator Margin="10"
                          Width="180"
                          HorizontalAlignment="Center"
                          VerticalAlignment="Center">
            <StackPanel>
                <Button Margin="2"
                        Click="ShowTop"
                        Content="Show Top" />
                <Button Margin="2"
                        Click="ShowBottom"
                        Content="Show Bottom" />
                <TextBox Margin="0, 10, 0, 0"
                         Controls:TextboxHelper.Watermark="Number smaller than 10"
                         Text="{Binding IntegerGreater10Property, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged, NotifyOnValidationError=True}" />
            </StackPanel>
        </AdornerDecorator>

        <StackPanel Margin="10"
                    HorizontalAlignment="Right">
            <Button MinWidth="90"
                    Margin="2"
                    Click="ShowLeft"
                    Content="Show Left" />
        </StackPanel>
    </Grid>

</Controls:MetroWindow>
